<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="1024" @ok="handleSubmit">
    <BasicForm @register="registerForm">
      <template #marbasclassSlot="{ model, field }">
        <a-input-search v-model:value="model[field]" placeholder="请选择主分类" :disabled="isDetail" @search="openMarbasclass" />
      </template>
    </BasicForm>
    <a-tabs v-model:activeKey="activeKey" type="card" :destroyInactiveTabPane="true">
      <a-tab-pane key="1" tab="基本信息" :forceRender="true">
        <BasicForm @register="registerBasicForm">      
          <template #stockUnitSlot="{ model, field }">
            <a-input-search v-model:value="model[field]" placeholder="请选择库存单位名称" :disabled="isDetail" @search="open(1)" />
          </template>
          <template #weightUnitSlot="{ model, field }">
            <a-input-search v-model:value="model[field]" placeholder="请选择重量单位名称" :disabled="isDetail" @search="open(2)" />
          </template>
          <template #volumeUnitSlot="{ model, field }">
            <a-input-search v-model:value="model[field]" placeholder="请选择体积单位名称" :disabled="isDetail" @search="open(3)" />
          </template>
          <template #warehouseSlot="{ model, field }">
            <a-input-search v-model:value="model[field]" placeholder="请选择默认仓库" :disabled="isDetail" @search="openWarehouse" />
          </template>
          <template #receivingPrincipleSlot="{ model, field }">
            <a-input-search v-model:value="model[field]" placeholder="请选择收货原则" :disabled="isDetail" @search="shippingPrincipleRegModalOpen" />
          </template>
        </BasicForm>
      </a-tab-pane>
      <a-tab-pane key="2" tab="生产信息" :forceRender="true">
        <BasicForm @register="registerProductionForm">
          <template #supplierSlot="{ model, field }">
            <a-input-search v-model:value="model[field]" placeholder="请选择默认供应商" :disabled="isDetail" @search="openSupplier" />
          </template>
        </BasicForm>
      </a-tab-pane>
      <a-tab-pane key="3" tab="采购信息" :forceRender="true">
        <BasicForm @register="registerPurchaseForm"></BasicForm>
      </a-tab-pane>
      <a-tab-pane key="4" tab="计划信息" :forceRender="true">
        <BasicForm @register="registerPlanForm"></BasicForm>
      </a-tab-pane>
    </a-tabs>
  </BasicModal>
  <!-- 单位选择 -->
  <unitSelectModel @register="regModal" @getSelectResult="handleSuccess" v-bind="getBindValue"></unitSelectModel>
  <!-- 料品分类 -->
  <marbasclassSelectModel @register="marbasclassregModal" @getSelectResult="handleMarbasclassSuccess" v-bind="getBindValue"></marbasclassSelectModel>
  <!-- 仓库 -->
  <warehouseSelectModel @register="warehouseRegModal" @getSelectResult="warehousehandleSuccess" v-bind="getBindValue"></warehouseSelectModel>
  <!-- 供应商 -->
  <supplierSelectModel @register="supplierRegModal" @getSelectResult="supplierHandleSuccess" v-bind="getBindValue"></supplierSelectModel>
  <!-- 收货原则 -->
  <shippingPrincipleSelectModel @register="shippingPrincipleRegModal" @getSelectResult="shippingPrincipleandleSuccess" v-bind="getBindValue"></shippingPrincipleSelectModel>

</template>

<script lang="ts" setup>
import { ref, computed, unref } from 'vue';
import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
import { BasicForm, useForm } from '/@/components/Form/index';
import { formSchema,basicFormSchema,productionFormSchema,purchaseFormSchema,planFormSchema } from '../BasMaterial.data';
import { saveOrUpdate } from '../BasMaterial.api';
import unitSelectModel from '/@/views/components/unitSelectModel.vue';
import marbasclassSelectModel from '/@/views/components/marbasclassSelectModel.vue';
import warehouseSelectModel from '/@/views/components/warehouseSelectModel.vue';
import supplierSelectModel from '/@/views/components/supplierSelectModel.vue';
import paymentConditionSelectModel from './paymentConditionSelectModel.vue';
import shippingPrincipleSelectModel from '/@/views/components/shippingPrincipleSelectModel.vue';
import { localStorage } from '/@/utils/store/locaStore';
const activeKey = ref('1');
// Emits声明
const emit = defineEmits(['register', 'success']);
const isUpdate = ref(true);
const isDetail = ref(false);
//主表单配置
const [registerForm, { setProps, resetFields, setFieldsValue, validate }] = useForm({
  labelWidth: 80,
  schemas: formSchema,
  showActionButtonGroup: false,
  baseColProps: { span: 8 },
});
// 基本信息 表单配置
const [registerBasicForm, { 
  resetFields:resetBasicFields, 
  setFieldsValue:setBasicFieldsValue,
  getFieldsValue:getFieldsBasicValue,
  }] = useForm({
  labelWidth: 130,
  schemas: basicFormSchema,
  showActionButtonGroup: false,
  baseColProps: { span: 8 },
});
// 生产信息 表单配置
const [registerProductionForm, { 
  resetFields:resetProductionFields, 
  setFieldsValue:setProductionFieldsValue,
  getFieldsValue:getFieldsProductionValue
  }] = useForm({
  labelWidth: 130,
  schemas: productionFormSchema,
  showActionButtonGroup: false,
  baseColProps: { span: 8 },
});
// 采购信息 表单配置
const [registerPurchaseForm, { 
  resetFields:resetPurchaseFields, 
  setFieldsValue:setPurchaseFieldsValue,
  getFieldsValue:getFieldsPurchaseValue,
  }] = useForm({
  labelWidth: 130,
  schemas: purchaseFormSchema,
  showActionButtonGroup: false,
  baseColProps: { span: 8 },
});
// 计划信息 表单配置
const [registerPlanForm, { 
  resetFields:resetPlanFields, 
  setFieldsValue:setPlanFieldsValue,
  getFieldsValue:getFieldsPlanValue,
   }] = useForm({
  labelWidth: 130,
  schemas: planFormSchema,
  showActionButtonGroup: false,
  baseColProps: { span: 8 },
});

const [regModal, { openModal }] = useModal();
const [marbasclassregModal, { openModal: openMarbasclassModal }] = useModal();
const [warehouseRegModal, { openModal: openwarehouseModal }] = useModal();
const [supplierRegModal, { openModal: supplierModal }] = useModal();
const [shippingPrincipleRegModal, { openModal: openShippingPrincipleRegModal }] = useModal();
function open(type) {
  openModal(true, {
    isUpdate: false,
    showFooter: true,
    type: type,
  });
}
function openMarbasclass() {
  openMarbasclassModal(true, {
    isUpdate: false,
    showFooter: true,
  });
}

const getBindValue = Object.assign({}, '');

//表单赋值
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
  //重置表单
  await resetFields();
  await resetBasicFields();
  await resetProductionFields();
  await resetPurchaseFields();
  await resetPlanFields();
  setModalProps({ confirmLoading: false, showCancelBtn: !!data?.showFooter, showOkBtn: !!data?.showFooter });
  isUpdate.value = !!data?.isUpdate;
  isDetail.value = !!data?.isDetail;
  if (unref(isUpdate)) {
    //表单赋值
    await setFieldsValue({ ...data.record });
    await setBasicFieldsValue({ ...data.record });
    await setProductionFieldsValue({ ...data.record });
    await setPurchaseFieldsValue({ ...data.record });
    await setPlanFieldsValue({ ...data.record });
  }
  // 隐藏底部时禁用整个表单
  setProps({ disabled: !data?.showFooter });
});
//设置标题
const title = computed(() => ( unref(isDetail) ? '详情' : !unref(isUpdate) ? '新增' : '编辑'));
//表单提交事件
async function handleSubmit(v) {
  try {
    let values = await validate();
    setModalProps({ confirmLoading: true });
    // 处理组织参数
    if (localStorage.get('productDepartmentId')) {
      values.productDepartmentName = localStorage.get('productDepartmentId');
      values.productDepartmentCode = localStorage.get('productDepartmentIdCode')
      localStorage.remove('productDepartmentId');
      localStorage.remove('productDepartmentIdCode');
    }
    // 获取基本信息表单数据
    let basicFormData = getFieldsBasicValue();
    // 获取生产信息表单数据
    let productionFormData = getFieldsProductionValue();
    // 获取采购信息表单数据
    let purchaseFormData = getFieldsPurchaseValue();
    // 获取计划信息表单数据
    let planFormData = getFieldsPlanValue();
    // 合并所有表单数据
    let formValues = Object.assign({},values,basicFormData,productionFormData,purchaseFormData,planFormData);
    //提交表单
    await saveOrUpdate(formValues, isUpdate.value);
    //关闭弹窗
    closeModal();
    //刷新列表
    emit('success');
  } finally {
    setModalProps({ confirmLoading: false });
  }
}
// 打开选择出货原则
function shippingPrincipleRegModalOpen(props) {
  openShippingPrincipleRegModal(true,{
    isUpdate: false,
    showFooter: true,
  })
}
// 出货原则回写
function shippingPrincipleandleSuccess(val,values) {
  setBasicFieldsValue({
    receivingPrincipleName: val[0].label,
    receivingPrincipleId: val[0].value,
  });
}
//打开选择供应商
function openSupplier() {
  supplierModal(true, {
    isUpdate: false,
    showFooter: true,
  });
}
//打开仓库
function openWarehouse() {
  openwarehouseModal(true, {
    isUpdate: false,
    showFooter: true,
  });
}
//默认仓库回写
function warehousehandleSuccess(val, values) {
  setBasicFieldsValue({
    warehouseName: val[0].label,
    warehouseId: val[0].value,
  });
}
//供应商回写
function supplierHandleSuccess(val, values) {
  setProductionFieldsValue({
    supplierName: val[0].label,
    supplierId: val[0].value,
  });
}
//选择回写
function handleSuccess(val, values, type) {
  if (type == 1) {
    setBasicFieldsValue({
      stockUnitName: val[0].label,
      stockUnitId: val[0].value,
    });
  } else if (type == 2) {
    setBasicFieldsValue({
      weightUnitName: val[0].label,
      weightUnitId: val[0].value,
    });
  } else if (type == 3) {
    setBasicFieldsValue({
      volumeUnitName: val[0].label,
      volumeUnitId: val[0].value,
    });
  }
}
//选择料品分类回写
function handleMarbasclassSuccess(val, values) {
  setFieldsValue({
    marbasclassName: val[0].label,
    marbasclassId: val[0].value,
  });
}
</script>

<style lang="less" scoped>
/** 时间和数字输入框样式 */
:deep(.ant-input-number) {
  width: 100%;
}

:deep(.ant-calendar-picker) {
  width: 100%;
}
</style>